<template>

<div class="daoBox">
  <daoTop @openAlert="openAlert"></daoTop>
  <daoBot :mapData="mapData" :page="page" :pageSize="pageSize" :total="total" @resetTable="getHosp" @searchFun="searchFun" @changeArr="changeArr" @pageSizeChange="pageSizeChange" @pageChange="pageChange"></daoBot>
  <alert v-if="add" @closeAlert="closeAlert" @resetTable="getHosp" :rowType="rowType" :rowArr="rowArr" ></alert>
</div>

  
</template>

<script>
import daoTop from './HospComponents/daoTop.vue'
import daoBot from './HospComponents/daoBut.vue'
import alert from './HospComponents/alert.vue'
import {getHospData} from '../../api/hosp'
export default {
    components: {
      daoTop,
      daoBot,
      alert
    },
    data() {
      return {
        add:false,
        rowType:0,
        rowArr:{},
        inputText: '',  
        mapData: [],
        page: 1,
        pageSize:10,
        total:0
      }
    },
    mounted () {
      this.getHosp()
    },
    methods: {
      getHosp(){
        getHospData({inputText:this.inputText,page:this.page,pageSize:this.pageSize}).then(res=>{
          if(res.code==200){
            this.mapData= res.data
            this.total=res.total
          }
        })
      },
      searchFun(val){
        this.inputText=val
        this.add=true
        this.getHosp()
      },
      openAlert(){
        this.rowArr={}
        this.rowType = 0
        this.add=true
      },
      closeAlert(){
        this.add=false
      },
      changeArr(row){
          this.rowArr=row
          this.rowType=1
          this.add=true
      },
      pageSizeChange(val){
        this.pageSize=val
        this.page=1
        this.getHosp()

      },
      pageChange(val){
        this.page=val
        this.getHosp()
      }
    }
    
}
</script>

<style scoped lang="less">
  .daoBox{
    height: 100%;
    background-color: rgb(233, 238, 243);
    padding: 0px 25px ;
    display: flex;
    flex-direction: column;
    position: relative;
  }




</style>